<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学生信息管理</title>
    <!-- Bootstrap -->
    <link href="/static/css/bootstrap.min.css" rel="stylesheet">
    <style>
      body{background-color:#eee;}
    </style>
  </head>
  <body>   
    <!-- 页面容器开始 -->
    <div class="container">
      <div class="row">
        <!--页面左侧主体开始-->
        <div class="col-md-12 text-center">
            <h2>学生信息管理</h2>
            <br>
            <a type="button" href="/add" class="btn btn-primary btn-sm">添加信息</a>
            <a type="button" href="#" class="btn btn-primary btn-sm">返回首页</a>
            <br><br>
            <form action="/" method="get">
               姓名：<input type="text" name="name" size="6" />
               性别：<select name="sex">
                        <option value="">全部</option>
                        <option value="1">男</option>
                        <option value="0">女</option>
                    </select>
               <input type="submit" value="搜索" />
            </form>
            <br/>
            <table class="table table-hover text-center">
              <tbody><tr>
                <th class="text-center">id号</th>
                <th class="text-center">姓名</th>
                <th class="text-center">性别</th>
                <th class="text-center">年龄</th>
                <th class="text-center">班级</th>
                <th class="text-center">编辑</th>
              </tr>
              <% stuList.forEach((stu) => { %>
              <tr>
                <td><%= stu.sno %></td>
                <td><%= stu.name %></td>
                <!-- <td><%= stu.sex==1? "男" : "女" %></td> -->
                <td><%= sexinfo[stu.sex] %></td>
                <td><%= stu.age %></td>
                <td><%= stu.classid %></td>
                <td>
                  <a type="button" href="/edit?id=<%= stu._id %>" class="btn btn-info btn-xs">编辑</a>
                  <a type="button" href="javascript:doDelete('<%= stu._id %>')" class="btn btn-danger btn-xs">删除</a>
                </td>
              </tr>
              <% }) %>
            </tbody></table>
        </div>
        <!--页面左侧主体开始-->
      </div>
    </div>
    <!-- 页面容器结束 -->
    <script>
        // 定义删除判断处理函数
        function doDelete(id){
          // 弹出删除询问框，点击确认返回true
          if(window.confirm("确定要删除吗？")){
            // 执行页面跳转到删除地址上，并传递id号
            window.location.href = "/del?id="+id;
          }
        }

    </script>
  </body>
</html>